<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    

<script>
// JS代码执行分为两步：1.预解析 2.逐行执行

/* var x = 10;// 全局变量
function fn(){
    // 词法作用域(静态作用域)，在词法分析阶段已经确定了整个作用域链
    // 静态作用域，关注的是函数在哪定义
    // 动态作用域，关注的是函数在哪调用

    console.log( x );// 10
}
function test(){
    var x = 20;// 局部变量
    fn();
}
test(); */


/* var a = b = 1;
// var a; 全局变量 
// b = 1; 隐式声明，全局变量 
// a = b;

function show(){
    var a = b = 2;
    // var a; 局部变量
    // b = 2; 修改全局变量
    // a = b;
}
show();
console.log( a );// 1
console.log( b );// 2 */



/* var a = 1;
function fun(){
    console.log( a );// 1
    a = 2;// 修改全局变量
}
fun();
console.log( a );// 2 */

/* var a = 1;
function fun(a){
    console.log( a );// undefined
    a = 2;// 修改形参
}
fun();
console.log( a );// 1 */

/* var a = 1;
function fun(a){
    console.log( a );// 1 
    a = 2;// 修改形参
}
fun(a);// fun(1)
console.log( a );// 1 */


/* // 声明提升机制：变量声明或函数声明时，声明会提升到当前作用域顶部
var a = 1;
function test(){
    console.log( a );// undefined
    var a = 2;
}
test();
console.log( a );// 1

// 上面代码预解析之后：
function test(){
    var a;
    console.log( a );// undefined
    a = 2;// 修改局部变量
}
var a;
a = 1;
test();
console.log( a );// 1 */


console.log( typeof fn );// 'function'
function fn(){}
var fn = 123;
console.log( typeof fn );// 'number'

// 上面代码预解析之后：
function fn(){}
// var fn; 变量和函数同名，函数优先
console.log( typeof fn );// 'function'
fn = 123;
console.log( typeof fn );// 'number'


</script>
</body>
</html>